<template>
	<view class="content">
		<!-- 回复 -->
		<u-form :model="formData" ref="uForm" label-align="center" :label-style="labelStyle" :error-type="errorType"
			label-width=180>
			<u-form-item prop="content" label="回复内容" class="form-item-top" label-align="left" label-position="top">
				<u-input type="textarea" confirmType="done" height="200" placeholder=" " v-model="formData.content"
					maxlength="2048" trim :custom-style="styles" :placeholderStyle="placeholderStyle" />
			</u-form-item>
		</u-form>
		<u-button class="bottom" type="primary" :disabled="disabled" :loading="loading" @click="submit">回复</u-button>
	</view>
</template>

<script>
	export default {
		name: "reply",
		props: {
			feedback_id: {
				type: String,
				default: ''
			}
		},
		data() {
			let formData = {
				content: '',
				is_reply: true,
				feedback_id: this.feedback_id,
			}
			return {
				disabled: false,
				loading: false,

				formData,

				rules: {
					"content": [{
						required: true,
						message: '请输入回复内容',
						trigger: 'blur',
					}],
				},
				placeholderStyle: this.$css.placeholderStyle,
				styles: this.$css.styles,
				errorType: this.$css.errorType,
				labelStyle: this.$css.labelStyle,
			}
		},
		mounted() {
			this.initPage();
		},
		onReady() {
			if (this.$refs.uForm) this.$refs.uForm.setRules(this.rules);
		},
		methods: {
			initPage() {
				// #ifdef H5
				this.$nextTick(function() {
					if (this.$refs.uForm) this.$refs.uForm.setRules(this.rules);
				})
				// #endif
			},

			submit() {
				this.disabled = true;
				this.loading = true;

				this.$refs.uForm.validate(valid => {
					if (valid) {
						this.submitForm();
					} else {
						this.disabled = false;
						this.loading = false;
					}
				})
			},
			// 提交
			submitForm() {
				vk.callFunction({
						url: this.$api.ReplyFeedback,
						loading: true,
						data: this.formData
					})
					.then(res => {
						vk.toast('回复成功', "none", 1000, true, () => {
							this.$emit('success');
						})
					})
			},
		}
	}
</script>

<style scoped>

</style>